jdp-container {
    -moz-animation: jdpOpenAnimation .3s cubic-bezier(.23,1,.32,1);
    -webkit-animation: jdpOpenAnimation .3s cubic-bezier(.23,1,.32,1);
    animation: jdpOpenAnimation .3s cubic-bezier(.23,1,.32,1);
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 6px rgba(0,0,0,.12),0 1px 4px rgba(0,0,0,.24);
    direction: rtl;
    display: none;
    max-width: 307.875px;
    min-width: 307.875px;
    overflow: hidden;
    padding: .5rem 0;
    position: absolute;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

    jdp-container, jdp-container *, jdp-container :after, jdp-container :before {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-family: 'b yekan' !important;
    }

        jdp-container .jdp-icon-minus, jdp-container .jdp-icon-plus {
            border: 1px solid #e6e6e6;
            border-radius: 4px;
            cursor: pointer;
            display: inline-block;
            flex: none;
            overflow: hidden;
            text-align: center;
            text-decoration: none;
            vertical-align: middle
        }

            jdp-container .jdp-icon-minus svg, jdp-container .jdp-icon-plus svg {
                height: 1.5rem;
                padding: .25rem;
                vertical-align: middle;
                width: 1.5rem
            }

            jdp-container .jdp-icon-minus.not-in-range, jdp-container .jdp-icon-plus.not-in-range {
                cursor: not-allowed
            }

                jdp-container .jdp-icon-minus.not-in-range svg, jdp-container .jdp-icon-plus.not-in-range svg {
                    opacity: .3
                }

        jdp-container .jdp-months, jdp-container .jdp-years {
            fill: rgba(0,0,0,.9);
            color: rgba(0,0,0,.9);
            display: -webkit-inline-box;
            display: -webkit-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            font-size: 120%;
            margin: 0 2.5%
        }

        jdp-container .jdp-months {
            width: 50%
        }

        jdp-container .jdp-years {
            width: 40%
        }

        jdp-container .jdp-month, jdp-container .jdp-month input, jdp-container .jdp-month select, jdp-container .jdp-year, jdp-container .jdp-year input, jdp-container .jdp-year select {
            background: #fff;
            border: none;
            border-radius: 0;
            color: inherit;
            display: inline-block;
            font-family: inherit;
            font-size: inherit;
            font-weight: 300;
            height: auto;
            line-height: inherit;
            margin: 0;
            outline: none;
            padding: 0;
            text-align: center;
            vertical-align: initial;
            width: 100%
        }

            jdp-container .jdp-month:active, jdp-container .jdp-month:focus, jdp-container .jdp-month input:active, jdp-container .jdp-month input:focus, jdp-container .jdp-month select:active, jdp-container .jdp-month select:focus, jdp-container .jdp-year:active, jdp-container .jdp-year:focus, jdp-container .jdp-year input:active, jdp-container .jdp-year input:focus, jdp-container .jdp-year select:active, jdp-container .jdp-year select:focus {
                outline: none
            }

            jdp-container .jdp-month input option, jdp-container .jdp-month option, jdp-container .jdp-month select option, jdp-container .jdp-year input option, jdp-container .jdp-year option, jdp-container .jdp-year select option {
                font-size: 90%
            }

            jdp-container .jdp-month:hover, jdp-container .jdp-year:hover {
                filter: brightness(.9)
            }

            jdp-container .jdp-month input, jdp-container .jdp-year input {
                -webkit-appearance: none;
                -moz-appearance: textfield;
                cursor: text
            }

                jdp-container .jdp-month input::-webkit-inner-spin-button, jdp-container .jdp-month input::-webkit-outer-spin-button, jdp-container .jdp-year input::-webkit-inner-spin-button, jdp-container .jdp-year input::-webkit-outer-spin-button {
                    -webkit-appearance: none
                }

            jdp-container .jdp-month select, jdp-container .jdp-year select {
                -webkit-appearance: menulist;
                -moz-appearance: menulist;
                cursor: pointer;
                position: relative
            }

        jdp-container .jdp-days {
            -ms-flex-pack: justify;
            display: inline-block;
            display: -ms-flexbox;
            display: flex;
            flex-wrap: wrap;
            -ms-flex-wrap: wrap;
            justify-content: space-around;
            outline: 0;
            padding: .5rem 0 0;
            text-align: left;
            width: 100%
        }

        jdp-container .jdp-day, jdp-container .jdp-day-name {
            background: none;
            border: 1px solid transparent;
            color: rgba(0,0,0,.9);
            display: inline-block;
            flex-basis: 14.2857143%;
            font-weight: 400;
            height: 31px;
            justify-content: center;
            line-height: 31px;
            margin: 2px 0;
            position: relative;
            text-align: center;
            width: 14.2857143%
        }

            jdp-container .jdp-day-name.today, jdp-container .jdp-day.today {
                border-color: rgba(0,0,0,.3)
            }

            jdp-container .jdp-day-name.selected, jdp-container .jdp-day.selected {
                background-color: #569ff7 !important;
                color: #fff !important
            }

            jdp-container .jdp-day-name.holly-day, jdp-container .jdp-day-name.last-week, jdp-container .jdp-day.holly-day, jdp-container .jdp-day.last-week {
                color: #f44336
            }

            jdp-container .jdp-day.not-in-month {
                opacity: .4
            }

            jdp-container .jdp-day.disabled-day {
                cursor: not-allowed;
                opacity: .15
            }

            jdp-container .jdp-day:not(.disabled-day) {
                border-radius: 4px;
                cursor: pointer;
                transition: .1s linear
            }

                jdp-container .jdp-day:not(.disabled-day):hover {
                    background: rgba(0,0,0,.1);
                    transform: scale(1.15);
                    z-index: 1
                }

        jdp-container .jdp-day-name {
            background-color: rgba(0,0,0,.1);
            border-radius: 0;
            cursor: default;
            font-size: 90%;
            font-weight: 900
        }

        jdp-container .jdp-footer {
            -ms-flex-pack: justify;
            display: inline-block;
            display: -ms-flexbox;
            display: flex;
            flex-wrap: nowrap;
            -ms-flex-wrap: nowrap;
            justify-content: space-between;
            outline: 0;
            padding: .5rem .5rem 0;
            width: 100%
        }

        jdp-container .jdp-btn-empty, jdp-container .jdp-btn-today {
            background: #569ff7;
            border-radius: 5px;
            color: #fff;
            cursor: pointer;
            display: inline-block;
            font-size: 90%;
            font-weight: 400;
            padding: .3em .6em;
            text-align: center
        }

            jdp-container .jdp-btn-empty.disabled-btn, jdp-container .jdp-btn-today.disabled-btn {
                cursor: not-allowed;
                opacity: .2
            }

@-webkit-keyframes jdpOpenAnimation {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes jdpOpenAnimation {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@media only screen and (max-width:307.875px) {
    jdp-container {
        max-width: 90%;
        min-width: 80%
    }
}